import {reactive, ref, toRefs} from 'vue'


/**
 * @description 将物流订单信息平铺到送卡订单（一个物流订单对应多个送卡订单）
 * @props 合并行的列prop集合
 */
const flatTable = (props) => {
  return (data) => {
    const list = data.map(da => {
      const length = da.orderInfos.length
      return da.orderInfos.map((item, index) => {
        // 配置合并行, 当一个物流订单下的第一个送卡订单行，打入即将要合并的行数
        const merge = {}
        props.map(prop => {
          merge[prop] = {
            rowspan: index === 0 ? length : 0,
            colspan: index === 0 ? 1 : 0
          }
        })
        return Object.assign(Object.create(null), da, item, {merge})
      })
    })
    return list.flat()
  }
}

/**
 * @description 合并表格行,搭配flatTable转换后的数据使用
 * @param props 合并行的列prop集合
 */
const tableSpanMerge = (props) => {
  return ({row, column}) => {
    // 如果当前列prop是在 要合并的集合中，则需取出row.merge合并
    if (props.includes(column.property)) {
      return row.merge[column.property]
    }
    return {
      colspan: 1,
      rowspan: 1
    }
  }
}

/**
 * @description 快捷使用List组件的数据配置
 * @param columns 表格列配置
 * @param load 获取表格数据方法
 * @param tableAttrs 表格组件配置
 */
export const useList = ({columns, load, tableAttrs = {}}) => {
  // loading
  const loading = ref(false)
  // 表格
  const table = reactive({
    columns,
    rows: [],
    attrs: {
      align: 'center',
      ...tableAttrs
    }
  })
  // 分页
  const pagination = reactive({
    currentPage: 1,
    pageSize: 10,
    total: 0,
    events: {
      sizeChange (size) {
        typeof load === 'function' && load()
      },
      currentChange (page) {
        typeof load === 'function' && load()
      }
    }})

  return [loading, table, pagination]
}

/**
 * @description 处理list列表的方法汇总
 * @param mergeRowsProps 合并行的列prop集合
 */
export const useListFn = ({mergeRowsProps}) => {
  return {
    flatTable: flatTable(mergeRowsProps),
    tableSpanMerge: tableSpanMerge(mergeRowsProps)
  }
}
